<!DOCTYPE html>
<html  lang="zh-CN"
       xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>手机号登录</title>
    <meta charset="UTF-8">
    <title>手机号登录</title>
    <meta name="keywords" content="手机号登录"/>
    <meta name="description" content="手机号登录"/>
    <meta name="viewport" content="width=device-width,initial-scale=1, maximum-scale=1,minimum-scale=1, user-scalable=no">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="format-detection" content="telephone=no"/>
    <meta name="viewport" content="width=device-width,viewport-fit=cover">
    <meta name="_csrf" th:content="${_csrf.token}"/>
    <meta name="_csrf_header"  th:content="${_csrf.headerName}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/shoppingApi/css/public.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/shoppingApi/css/publicOfuser.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/shoppingApi/css/combtn.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/shoppingApi/css/weui.min.css}">
    <script th:src="@{/shoppingApi/js/jquery-3.3.1.min.js}"></script>
    <!--<script th:src="@{/shoppingApi/js/common.js}"></script>-->
    <script type="text/javascript" th:src="@{/shoppingApi/js/jquery-weui.min.js}"></script>
</head>
<body>
<div class="main login bgfff">
    <!--<div class="goback fixed-back"><h3 onclick="location.href='/wap/openUserCenter'">手机号登陆</h3></div>-->
    <div class="main_con c323232">

        <div class="header">
        </div>

        <div class="mt55 mr15 ml15">

            <ul class="login-form">
                <li>
                    <div class="clearfix input_border_bottom_normal">
                        <!--<img class="ml15 fl form-icon" th:src="@{/shoppingApi/images/register_phoone_normal.png}" style="height: 22px;">-->
                        <div class="overflow pr15">
                            <input class="ft18 c323232  w100 ml15 phone form-input" name="phone" value="" placeholder="请输入手机号" type="text">
                        </div>
                    </div>
                    <p class="phone-msg"><span style="font-size: 14px;color: red"></span></p>
                </li>

                <li>
                    <div class="clearfix mt20 input_border_bottom_normal">
                        <a class="pinkbtn button pink bigrounded fr code-button code" id="code">获取验证码</a>
                        <div class="overflow pr15">
                            <input class="ft18 c323232  w100 ml15 phone-code form-input form-code" name="phoneCode" value="" placeholder="请输入验证码" type="text">
                        </div>
                    </div>
                    <p class="phone-code-msg"><span style="font-size: 14px;color: red"></span></p>
                </li>

                <li>
                    <div><a  class="submit mt40 bigrounded button red login-phone ">登录</a></div>
                    <p class="login-phone-msg"><span style="font-size: 14px;color: red"></span></p>
                </li>
                <!--<li>-->
                    <!--<div class="mt15 ml15" style="line-height:24px;">-->
                        <!--&lt;!&ndash;<div class="fl">&ndash;&gt;-->
                            <!--<label class="agree-checkbox checked">-->
                                <!--<input type="checkbox" checked="checked" style="display:none">-->
                                <!--<span class="ml10 ft12 c323232">登录即代表您已同意</span>-->
                            <!--</label>-->
                        <!--&lt;!&ndash;</div>&ndash;&gt;-->
                        <!--<a class="ft12 cf70029">《新零售微店用户协议》</a>-->
                    <!--</div>-->
                <!--</li>-->
                <li>
                    <div class="mt30 ft13 ml15 mr15">
                        <a href="javascript:;" class="c646464 loginpassword"><span>密码登录</span></a>
                        <a  class="c646464"><span class="fr register" >注册</span></a>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</div>
</body>
<script>
    // $(function () {
    //     history.pushState({page: 1}, 'title', '/wap/openUserCenter');
    // });

    var flag = false;
    $('.phone').on('blur',function () {
        flag = validatePhone();
    });

    // 验证手机是否存在，并发送验证码
    $(document).on('click','.code',function () {
        if (flag) {
            var phone = $('.phone').val();
            $.ajax({
                url: '/wap/selectPhoneByPhone?phone=' + phone,
                success: function (result) {
                    if (result.phone) {
                        // setCode();
                        // getCodeTimer();
                        // $('.phone-msg span').html(result.msg.code);
                        $.ajax({
                            async:false,
                            dataType: 'json',
                            contentType: 'application/json',
                            url:'/wap/sendCodeByPhone?phone='+phone+"&type=5",
                            success:function (result) {
                                var  data=$.parseJSON(result.json);
                                //alert(data.message);
                                if(data.stat==100){
                                    getCodeTimer();
                                }else {
                                    $('.code-msg').html("发送错误!");
                                }
                            }
                        });
                    } else {
                        $('.phone-msg span').html('手机号码不存在');
                    }
                }
            })
        }
    })

    // 验证手机号格式
    function validatePhone () {
        var phone=$('.phone').val();
        var pattern = /^1[3456789]\d{9}$/;
        if (!pattern.test(phone)) {
            $('.phone-msg span').html("请输入正确的手机号");
            return false;
        } else {
            $('.phone-msg span').html("");
            return true;
        }
    }

    /*设置验证码*/
    function  setCode() {
        $('.phone-code').val('6666');
    }
    $.toast.prototype.defaults.duration = 1000;
    //登录
  $('.login-phone').on('click',function () {
      var phone=$('.phone').val();
      var code=$('.phone-code').val();
      if (!validatePhone()) return;
      if (code && code.length==4) {
          $.ajax({
              type: 'post',
              url: '/wap/loginByPhone',
              data: {
                  phone: phone,
                  code: code
              },
              success: function (result) {
                  if (result.msg == "000001") {
                      $.toast("登录成功");
                      var userNoId = result.userNo.id.toString();
                      var redirect = location.href.split('?redirect=')[1];
                      if (redirect) {
                          var url = decodeURIComponent(redirect);
                      } else {
                          // var url = '/wap/openUserCenter';
                           var url = '/wap/productIndex';
                          //var url = '/wap/activity?productId=490';
                      }
                      if(navigator.userAgent.indexOf("Html5Plus") > -1){
                          var pageIndex = plus.webview.getWebviewById('__W2A__www.ycsqd.com');
                          // var pageDetail = plus.webview.getWebviewById('detail');
                          plus.storage.setItem('userNoId', userNoId);
                          setTimeout(function () {
                              location.href = url;
                          }, 1000);
                          pageIndex.reload();
                      } else {
                          localStorage.setItem('userNoId', userNoId);
                          location.href = url;
                      }

                      // if(result.currentURL==null){
                      //     //currentURL为空时候跳转到用户中心
                      //     window.location.href='/wap/openUserCenter';
                      // }else{
                      //     window.location.href=result.currentURL;
                      // }
                  } else {
                      $.toast("验证码有误!", 'cancel');
                      $('.phone-msg').remove();
                      $('.phone-code-msg').remove();
                      // $('.login-phone-msg span').html(result.errorDetail);
                  }
              }
          })
      } else {
          $('.phone-code-msg span').html("请输入正确的验证码");
      }
  })

    // 验证码倒计时
    function getCodeTimer () {
        var leftTime = 59;
        $('#code').removeClass('code');
        // clearClick();
        // if (leftTime && leftTime > 0) {
        var codeTimer = setInterval(function () {
            leftTime--;
            // sessionStorage.setItem('timing', leftTime);
            $('#code').text(leftTime+'秒后重新获取').addClass('codeDisabled');
            if (leftTime == 0) {
                clearInterval(codeTimer);
                $('#code').text('重新获取').removeClass('codeDisabled');
                $('#code').addClass('code');
            }
        }, 1000);
        // }
    }

    //注册
    $('.register').on('click',function () {
        window.location.href="/wap/openRegister"
    })

    $('.loginpassword span').on('click',function () {
        var redirect = location.href.split('?redirect=')[1],
            url = "/wap/openLoginPwd";
        if (redirect) {
            url = url + '?redirect=' + redirect;
        }
        window.location.href=url;
    })

    $('.agree-checkbox').on('click', function (e) {
        if (!$(this).hasClass('checked')) {
            $(this).addClass('checked');
        } else {
            $(this).removeClass('checked');
        }
        e.preventDefault();
    });
</script>



</html>